<!DOCTYPE html>
<html>
<head>
    <meta name="layout" content="main"/>
    <g:set var="entityName" value="${message(code: 'questionnaire.label', default: 'Questionnaire')}"/>
    <title>问卷预览：${this.questionnaire?.name}</title>
    <style>
        .form-group{
            border-bottom: 1px dotted #f1f3f6;
            padding-bottom: 15px;
        }
    </style>
</head>

<body class="fixed-navbar fixed-sidebar">
<div class="small-header">
    <div class="hpanel">
        <div class="panel-body">
            <div id="hbreadcrumb" class="pull-right">
                <ol class="hbreadcrumb breadcrumb">
                    <li>贷款管理系统</li>
                    <li><g:link controller="questionnaire" action="index">问卷模板</g:link></li>
                    <li class="active">
                        <span>${this.questionnaire?.name}</span>
                    </li>
                </ol>
            </div>

            <h2 class="font-light m-b-xs" style="text-transform:none;">
                问卷模板：${this.questionnaire?.name}
            </h2>
        </div>
    </div>
</div>

<div class="content animate-panel">

    <div class="row">
        <div class="hpanel hblue">
            <div class="panel-heading">
                <div class="panel-tools">

                </div>
                问卷
            </div>

            <div class="panel-body">
                <div class="text-muted font-bold m-b-xs ol-md-6">
                    <div class="col-md-12"><h4><a href=>${this.questionnaire.name}</a></h4></div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="hpanel hyellow">
            <div class="panel-heading">
                <div class="panel-tools">

                    <a class="showhide"><i class="fa fa-chevron-up"></i></a>
                </div>
                问题
            </div>

            <div class="panel-body form-horizontal">
                <g:each in="${this.questionnaire?.questions}" var="question">
                    <div class="form-group">
                    <g:if test="${question?.questionType == 'input'}">
                        <label class="col-md-2 control-label">${question?.displayOrder}.${question?.name}：</label>

                        <div class="col-sm-10" style="padding-top: 8px"><label></label></div>
                    </g:if>
                    <g:elseif test="${question?.questionType == 'radio'}">
                        <label class="col-md-2 control-label">${question?.displayOrder}.${question?.name}：</label>

                        <div class="col-sm-10" style="padding-top: 8px">

                            <g:each in="${question?.options}" var="option">
                                <div class="">
                                    <label>

                                            <input class="i-checks" name="${option.name}" disabled
                                                   type="radio" value="${option?.name}"/> ${option?.name}
                                    </label>
                                </div>
                            </g:each>

                        </div>
                    </g:elseif>
                    <g:elseif test="${question?.questionType == 'checkbox'}">
                        <label class="col-md-2 control-label">${question?.displayOrder}.${question?.name}：</label>
                        <div class="col-sm-10" style="padding-top: 8px">

                        <g:each in="${question?.options}" var="option">
                            <div class="">
                                <label>

                                        <input class="i-checks" name="${option.name}" type="checkbox"
                                               value="${option?.name}" disabled/> ${option?.name}
                                </label>
                            </div>
                        </g:each>
                    </g:elseif>

                    </div>
                </g:each>
            </div>
            </div>
        </div>
    </div>

</div>
</body>
</html>
